<template>
  <view class="router-view container">
    <div class="bcl-main container cl-white" style="border-radius: 16rpx;">
      <div class="box">
        <view class="uni-avatar circle mr-10 box box-center">
          <image :src="userInfo.avatar || defaultImage" />
        </view>
        <view class="box-1">
          <div class="fz-16 bold">{{ userInfo.realname }}</div>
          <div class="mt-5 mb-5">{{ userInfo.card_number }}</div>
          <div>已实名 真人头像</div>
        </view>
      </div>
      <div class="box box-between mt-20 fz-12">
        <div>个人隐私信息安全保障中</div>
        <div>
          <navigator url="/user/info/info">查看更多</navigator>
        </div>
      </div>
    </div>

    <uni-cell title="个人信息" url="/user/info/intro"> </uni-cell>
    <uni-cell title="身份证实人认证" url="/user/setting/binding/name">
    </uni-cell>
  </view>
</template>

<script>
import { mapState } from "vuex";
import uniCell from "@/components/cell";

export default {
  data() {
    return {
      defaultImage: this.$config.default,
    };
  },

  computed: {
    ...mapState(["userInfo"]),
  },

  components: {
    uniCell,
  },
};
</script>

<style lang="scss" scoped>
.uni-avatar {
  image {
    width: 100upx;
    height: 100upx;
  }
}
</style>
